<template>
  <div>
    <ul>
      <li :key="i" v-for="(v, i) in datas" class="list">
        <p>{{ v.name }}</p>
        <p>{{ v.address }}</p>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
    name: 'searchCityVal',
    data() {
        return {
            datas: {}
        };
    },
    methods:{
      // sendAdress(){
      //   this.$store.commit("sendAdress", this.datas);
      //   console.log(this.datas)
      // }
    },
     created() {

        // let _this = this;
        this.axios({
      metod: "GET",
      url: `https://elm.cangdu.org/v1/pois?city_id=${this.$store.state.allObj.id}&keyword=${this.$store.state.searchCityVal}&type=search`,
    }).then((response) => {
      this.datas = response.data
      console.log(this.datas);
      console.log(this.$store.state.searchCityVal)
    });
  },

    watch: {
        "$store.state.searchCityVal"() {
              this.axios({
      metod: "GET",
      url: `https://elm.cangdu.org/v1/pois?city_id=${this.$store.state.allObj.id}&keyword=${this.$store.state.searchCityVal}&type=search`,
    }).then((response) => {
      this.datas = response.data
      console.log(this.datas);
      console.log(this.$store.state.searchCityVal)
    });
        }
    }
   
};
</script>

<style  scoped>
.list{
    border-bottom:1px solid #e6e6e6 ;
    /* text-align: center; */
    color:black;
}
.list p{
  font-size: 18px;
}
</style>